

var app = new Vue({
    el: '#homeApp',
    data: {
        message: 'Hello Vue!',
        goodsType:[], //物品类型
        coupons:[],  //优惠卷
        addressList:[],  //顾客地址簿
        pageUtil:{
            rowsCount:0,  //总行数
            curPage :1,  //当前页数
            startPage:1,  //开始页数
            rows:5,  //行数
            pageCount:1,  //总页数
        },
        sendOrPut:false,  //true为寄件人  false为收件人
        sendInfo:{   //寄件人信息
            name:'',//姓名
            phone:'',  //联系方式
            area:'',  //所属区域
            detailAddress:'',  //详细地址
            verifyNameMsg:'',  //姓名错误提示
            verifyPhoneMsg:'',  //联系方式错误提示信息
            verifyAreaMsg:'',  //所属区域错误提示信息
            verifyDetailAddress:'',  //详细地址错误提示信息
            nameCss:'', //姓名错误样式
            phoneCss:'', //手机填写样式
            detailAddrCss:'',  //详细地址填写样式
        },
        putInfo:{   //收件人信息
            name:'',//姓名
            phone:'',  //联系方式
            area:'',  //所属区域
            detailAddress:'',  //详细地址
            verifyNameMsg:'',  //姓名错误提示
            verifyPhoneMsg:'',  //联系方式错误提示信息
            verifyAreaMsg:'',  //所属区域错误提示信息
            verifyDetailAddress:'',  //详细地址错误提示信息
            nameCss:'', //姓名错误样式
            phoneCss:'', //手机填写样式
            detailAddrCss:'',  //详细地址填写样式
        },
        parseAddressText:'',//智能解析文本
        addressMessage:false,  //解析文本错误提示
        makeCargoMethod:0,   //提货方式  默认为上门取货
        couponId:0,  //优惠卷id
        remark:'',   //下单备注

    },
    mounted:function () {
        //获取物品类型
        this.getGoodsType();
        //获取优惠卷
        this.getCoupon();
        //根据顾客id获取地址
        this.getAddressByCusId();


    },
    methods:{
        //获取货物类型
        getGoodsType:function () {
            var it = this;
            //登录请求
            axios({
                method:'get',
                url:'/logistics/customer/queryAllGoodsType'
            }).then(function(res){

                it.goodsType = res.data.data


            }).catch(function (error){
                console.log('请求失败:'+err.status+','+err.statusText);
            });

        },
        //获取优惠卷
        getCoupon:function(){
            var it = this;
            axios({
                method:'get',
                url:'/logistics/customer/queryCouponByCustomerId'
            }).then(function (res) {
                it.coupons = res.data.data;
                if (it.coupons.length < 1){
                    it.coupons = [{id:'0',name:'无可用抵用卷'}];
                }

            }).catch(function (error) {

            })

        },
        //根据顾客id获取地址
        getAddressByCusId:function(){

            var it = this;

            axios({
                method:'get',
                url:'/logistics/customer/queryAddressByCustomerId?page=1&rows=5'
            }).then(function (res) {

                //分页地址数据
                it.addressList = res.data.data.result;
                //获取总行数
                it.pageUtil.rowsCount = res.data.data.pageCount;

                //算出总页数
                it.pageUtil.pageCount = parseInt((it.pageUtil.rowsCount+it.pageUtil.rows-1)/it.pageUtil.rows);

            }).catch(function (error) {

            })


        },
        //地址分页
        addressPage:function(page){

            var it = this;
            if (it.pageUtil.curPage != page){
                it.pageUtil.curPage = page;

                axios({
                    url:'/logistics/customer/queryAddressByCustomerId?page='+page+'&rows='+it.pageUtil.rows,
                    method:'get'
                }).then(function (res) {

                    //分页地址数据
                    it.addressList = res.data.data.result;

                }).catch(function (error) {

                    console.log("异常");

                })

            }


        },
        //判断打开了寄件人地址簿还是收件人地址簿
        isSendAddressOrPutAddress:function (sendOrPut) {

            var it = this;

            it.sendOrPut = sendOrPut;

        },
        //选择地址簿里的地址赋值到寄件人信息  收件人信息里
        valueAddressInfo:function (index) {

            var it = this;
            //获取地址里的对象
            var address = it.addressList[index];

            //赋值给寄件人
            if (it.sendOrPut){
                //给所属区域赋值
                var arrayArea = address.area.split("-");

                var $citypicker1 = $('#city-picker1');
                $citypicker1.citypicker("reset");
                $citypicker1.citypicker("destroy");

                //console.log(arrayArea);
                $citypicker1.citypicker({
                    province: arrayArea[0],
                    city: arrayArea[1],
                    district: arrayArea[2]
                });
                //给其他输入框赋值
                it.sendInfo.name = address.name;
                it.sendInfo.phone = address.tel;
                it.sendInfo.detailAddress = address.detailedAddress;


            }else{

                //给所属区域赋值
                var arrayArea = address.area.split("-");

                var $citypicker2 = $('#city-picker3');
                $citypicker2.citypicker("reset");
                $citypicker2.citypicker("destroy");

                $citypicker2.citypicker({
                    province: arrayArea[0],
                    city: arrayArea[1],
                    district: arrayArea[2]
                });

                it.putInfo.name = address.name;
                it.putInfo.phone = address.tel;
                it.putInfo.detailAddress = address.detailedAddress;

            }
            //关闭地址簿模态框
            $('#mailAddressModel').modal('hide');
            $(".modal-backdrop.fade").hide();


        },
        //智能解析按钮
        parseAddress:function(){

            //获取文本
            var parseAddressText = this.parseAddressText;

            var arrAddress = parseAddressText.split("，");

            if (arrAddress.length < 3){

                this.addressMessage = true;
                return false;
            }

            //获取省
            var provice = arrAddress[1].substring(0,arrAddress[1].indexOf("省")+1)
            //获取市
            var city = arrAddress[1].substring(arrAddress[1].indexOf("省")+1,arrAddress[1].indexOf("市")+1)
            //获取区
            var district = arrAddress[1].substring(arrAddress[1].indexOf("市")+1,arrAddress[1].indexOf("区")+1);
            //获取详细地址
            var detailAddress = arrAddress[1].substring(arrAddress[1].indexOf("区")+1,arrAddress[1].length);


            if(this.sendOrPut){

                //给寄件信息输入框赋值
                this.sendInfo.name = arrAddress[0];
                this.sendInfo.phone = arrAddress[2];
                //给所属区域赋值

                //给所属区域赋值
                var $citypicker2 = $('#city-picker1');
                $citypicker2.citypicker("reset");
                $citypicker2.citypicker("destroy");

                $citypicker2.citypicker({
                    province: provice,
                    city: city,
                    district: district
                });
                //给详细地址赋值
                this.sendInfo.detailAddress = detailAddress;


            }else{

                //给寄件信息输入框赋值
                this.putInfo.name = arrAddress[0];
                this.putInfo.phone = arrAddress[2];
                //给所属区域赋值

                //给所属区域赋值
                var $citypicker2 = $('#city-picker3');
                $citypicker2.citypicker("reset");
                $citypicker2.citypicker("destroy");

                $citypicker2.citypicker({
                    province: provice,
                    city: city,
                    district: district
                });
                //给详细地址赋值
                this.putInfo.detailAddress = detailAddress;


            }

            //关闭智能填写模态框
            $('#aiFillIn').modal('hide');
            $(".modal-backdrop.fade").hide();


        },
        //提交预录单
        orderSubmit:function () {
            var it = this;
            var area1 = $('#city-picker1').val().trim();
            var area2 = $('#city-picker3').val().trim();
            if (this.sendInfo.verifyNameMsg != '' || this.sendInfo.verifyPhoneMsg!=''||this.sendInfo.verifyDetailAddress!=''
                || this.putInfo.verifyNameMsg!=''||this.putInfo.verifyPhoneMsg!=''||this.putInfo.verifyDetailAddress!=''
                ){
                $('#submitMessage').text("您还有信息验证未通过哟");
                $('#submitMessage').addClass("d-block")

                return false;
            }


            if (this.sendInfo.name==''||this.sendInfo.phone==''||this.sendInfo.detailAddress==''
                || this.putInfo.name==''||this.putInfo.phone==''|| this.putInfo.detailAddress==''
                || area1=='' || area2==''){
                $('#submitMessage').text("您还有信息未填写哦");
                $('#submitMessage').addClass("d-block")
                return false;
            }

            //获取数据
            //寄件人信息
            var sendInfo = {
                putSendId:0,
                putSendName:this.sendInfo.name,
                putSendPhone:this.sendInfo.phone,
                putSendArea:area1.replace(/\//g,'-'),
                putSendDetailaddress:this.sendInfo.detailAddress,
                putSendType:1
            }
            //收人信息
            var putInfo = {
                putSendId:0,
                putSendName:this.putInfo.name,
                putSendPhone:this.putInfo.phone,
                putSendArea:area2.replace(/\//g,'-'),
                putSendDetailaddress:this.putInfo.detailAddress,
                putSendType:0
            }
            //预录单信息
            var preRecordedReceipt = {
                makeCargoMethod:it.makeCargoMethod,
                couponId:it.couponId,
                remark:it.remark
            }
            //json对象
            var putSendInfo = JSON.stringify({
                sendInfo: sendInfo,
                putInfo: putInfo,
                preRecordedReceipt:preRecordedReceipt
            });

            //下单
            axios({
                url:'/logistics/customer/placeOrder',
                data:{
                    putSendInfo:putSendInfo
                },
                method:'post'
            }).then(function (res) {
                if (res.data.code == 200){
                    $.toast({
                        title: '信息提示框',
                        subtitle: '10秒后自动关闭',
                        content: '恭喜你下单成功',
                        type: 'success',
                        delay: 10000,
                        pause_on_hover: false
                    });
                }else{

                    $.toast({
                        title: '信息提示框',
                        subtitle: '10秒后自动关闭',
                        content: '下单失败，重新试试',
                        type: 'error',
                        delay: 10000,
                        pause_on_hover: false
                    });

                }
                //下单后跳到顶部
                window.scrollTo({
                    left: 0,
                    top: 0,
                    behavior: 'smooth'
                })

            }).catch(function (error) {

                console.log("异常");

            })


        }
    },
    watch :{
        //寄件人姓名
        'sendInfo.name':function (newValue,oldValue) {

            if (newValue.trim() === '') {
                this.sendInfo.verifyNameMsg = "姓名不可为空";
                this.sendInfo.nameCss = 'is-invalid'
            } else {
                this.sendInfo.verifyNameMsg = '';
                this.sendInfo.nameCss = 'is-valid'
            }

        },
        //寄件人联系方式
        'sendInfo.phone':function (newValue,oldValue) {

            if(newValue === ''){
                this.sendInfo.verifyPhoneMsg = "联系方式不可为空";
                this.sendInfo.phoneCss = 'is-invalid'
            }else if(!(/^1([38]\d|5[0-35-9]|7[3678])\d{8}$/.test(newValue))){
                this.sendInfo.verifyPhoneMsg = "输入手机联系方式有误";
                this.sendInfo.phoneCss = 'is-invalid'
            }else{
                this.sendInfo.verifyPhoneMsg = "";
                this.sendInfo.phoneCss = 'is-valid'
            }

        },
        //寄件人详细地址
        'sendInfo.detailAddress':function (newValue,oldValue) {

            if (newValue === ''){
                this.sendInfo.verifyDetailAddress = "详细地址不可为空";
                this.sendInfo.detailAddrCss = 'is-invalid'
            }else if(newValue.length < 5 ){
                this.sendInfo.verifyDetailAddress = "不少于5字符";
                this.sendInfo.detailAddrCss = 'is-invalid'

            }else{
                this.sendInfo.verifyDetailAddress = "";
                this.sendInfo.detailAddrCss = 'is-valid'
            }

        },
        //收件人姓名
        'putInfo.name':function (newValue,oldValue) {
            if (newValue.trim() === '') {
                this.putInfo.verifyNameMsg = "姓名不可为空";
                this.putInfo.nameCss = 'is-invalid'
            } else {
                this.putInfo.verifyNameMsg = '';
                this.putInfo.nameCss = 'is-valid'
            }
        },
        //收件人联系方式
        'putInfo.phone':function (newValue,oldValue) {

            if(newValue === ''){
                this.putInfo.verifyPhoneMsg = "联系方式不可为空";
                this.putInfo.phoneCss = 'is-invalid'
            }else if(!(/^1([38]\d|5[0-35-9]|7[3678])\d{8}$/.test(newValue))){
                this.putInfo.verifyPhoneMsg = "输入手机联系方式有误";
                this.putInfo.phoneCss = 'is-invalid'
            }else{
                this.putInfo.verifyPhoneMsg = "";
                this.putInfo.phoneCss = 'is-valid'
            }

        },
        //寄收件人详细地址
        'putInfo.detailAddress':function (newValue,oldValue) {

            if (newValue === ''){
                this.putInfo.verifyDetailAddress = "详细地址不可为空";
                this.putInfo.detailAddrCss = 'is-invalid'
            }else if(newValue.length < 5 ){
                this.putInfo.verifyDetailAddress = "不少于5字符";
                this.putInfo.detailAddrCss = 'is-invalid'

            }else{
                this.putInfo.verifyDetailAddress = "";
                this.putInfo.detailAddrCss = 'is-valid'
            }

        },
    }
})
